<template>
  <div class="barracksCenterIndex">
    <div class="barracksCenterIndex--top">
      <WarehouseMap/>
    </div>
    <div class="barracksCenterIndex--bottom">
      <barracksCenterTwo></barracksCenterTwo>
    </div>
  </div>
</template>

<script setup>
// import barracksCenterOne from '@/views/armyScreen/barracks/center/barracksCenterOne.vue'
// import barracksCenterTwo from '@/views/armyScreen/barracks/center/barracksCenterTwo.vue'
import WarehouseMap from '@/views/armyScreen/barracks/change/WarehouseMap.vue'
import barracksCenterTwo from '@/views/armyScreen/barracks/change/DoorRecordComp.vue'
// import barracksCenterThree from '@/views/armyScreen/barracks/center/barracksCenterThree.vue'
</script>

<style lang="scss" scoped>
.barracksCenterIndex{
  padding-top: 25px;

  &--top {
    margin-top: 20px;
    color: rgb(23,4,23);
  }

  &--center {
    margin-top: 32px;
  }

  &--bottom {
    height: 260px;
    margin-top: 12px;
  }
}

</style>
